'use client'
import React, { Children, useState } from 'react';
import { Button, Layout, Menu, theme } from 'antd';
import { usePathname,useRouter } from 'next/navigation';

const { Header, Sider, Content } = Layout;

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  const [collapsed] = useState(false);
  const {
    token: { colorBgContainer, borderRadiusLG },
  } = theme.useToken();
  const pathname = usePathname()
  const router = useRouter()
  return (
    <Layout>
      <Sider style={{background:'#fff'}} trigger={null} collapsible collapsed={collapsed}>
        <div className="demo-logo-vertical" />
        <Menu
          theme="light"
          mode="inline"
          defaultSelectedKeys={[pathname]}
          onSelect={(e)=>{
            router.push(e.key)
          }}
          items={[
            {
              key: '/wzf/list',
              label: '回款计划',
            },
            {
              key: '/wzf/list2',
              label: '汇款管理',
            }
          ]}
        />
      </Sider>
      <Layout>
        <Content
          style={{
            margin: '24px 16px',
            padding: 24,
            minHeight: 280,
            background: colorBgContainer,
            borderRadius: borderRadiusLG,
          }}
        >
          {children}
        </Content>
      </Layout>
    </Layout>
  );
};
